// Alias document.getElementById
var $ = function(id) { return document.getElementById(id); };

// Alias Debugs
var info = function(msg, ctx) { 
	ctx = typeof ctx == "undefined" ? '' : ctx;
	if (ctx !== '') console.info('['+ctx+'] '+msg); 
	else console.info(msg);
};
var log = function(msg, ctx) {
	ctx = typeof ctx == "undefined" ? '' : ctx;
	if (ctx !== '') console.log('['+ctx+'] '+msg);
	else console.log(msg);
};
var error = function(msg, ctx) { 
	ctx = typeof ctx == "undefined" ? '' : ctx;
	if (ctx !== '') console.error('['+ctx+'] '+msg); 
	else console.error(msg);
};
var warn = function(msg, ctx) { 
	ctx = typeof ctx == "undefined" ? '' : ctx;
	if (ctx !== '') console.warn('['+ctx+'] '+msg);
	else console.warn(msg);
};

// Alias Time Debug
var time = function(name) {	console.time(name); }
var timeEnd = function(name) {	console.timeEnd(name); }
// Alias Group Debug
var group = function(name) {	console.group(name); }
var groupEnd = function(name) {	console.groupEnd(name); }

// Calculate FPS
var fps = 0, now, lastUpdate = (new Date)*1 - 1;
var fpsFilter = 50;
var calculateFPS = function() {
	var thisFrameFPS = 1000 / ((now=new Date) - lastUpdate);
	fps += (thisFrameFPS - fps) / fpsFilter;
	lastUpdate = now;

	var fpsOut = $('fps-counter');
	setInterval(function(){
		fpsOut.innerHTML = fps.toFixed(1) + "fps";
	}, 1000);
};

var height = function() {
	if (document.body && document.body.offsetHeight)
		h = document.body.offsetHeight;
	if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetHeight)
		h = document.documentElement.offsetHeight;
	if (window.innerHeight)
		h = window.innerHeight;

	return h;
}

var width = function() {
	if (document.body && document.body.offsetWidth)
		w = document.body.offsetWidth;
	if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetWidth)
		w = document.documentElement.offsetWidth;
	if (window.innerWidth)
		w = window.innerWidth;

	return w;
}

/* GRAPHIC TOOLS */
// Draw a rectangle
var drawRect = function(context,color,x,y,width,height) {
	context.fillStyle = color;
	context.fillRect(x, y, width, height);
}

// Draw a circle
var drawCircle = function(context,color,x,y,radius) {	
	context.fillStyle = color;
	context.beginPath();
	context.arc(x,y,radius,0,Math.PI*2,true);
	context.fill();
}